<template>
	<div class="page drinkingwater">
		<x-header class='header' slot="header" :left-options="{backText: ''}">心理指导</x-header>
		<div class="top" style="height: 50px; width: 100%;"></div>
		<view-box>
			<div class="list">
				<!--<h3>1、远离不健康的心理</h3>-->
				<p class="text" v-for="item in psychologyGuidance">{{item.text}}</p>
			</div>
		</view-box>
	</div>
</template>

<script>
	import Api from '@/api/index.js' //  引入api文件
	export default {
		data(){
			return {
				customer_id: '',
				psychologyGuidance: []
			}
		},
		created(){
			this.customer_id = localStorage.getItem('customer_id');
			this.getData();
		},
		methods:{
			getData(){   //  GET /improve/psychology_guidance/{customer_id}
				const psychology_guidanceApi = Api.psychology_guidanceApi + this.customer_id;   //  心理指导  API
				this.$http.get(psychology_guidanceApi)
				.then(({data})=>{
					console.log(data)
					let a = data.data.psychologyGuidance.replace(/\n/g, "<br/>");
					a.split('<br/>').map(e=>{
						this.psychologyGuidance.push({text: e})
					})
				})
				.catch((err)=>{
					console.log(err)
				})
			}
		}
	}
	
</script>

<style lang="less" scoped>

@colorblue: rgb(58,175,252);
@colorgray: rgb(102,102,102);

	.drinkingwater {
		position: fixed !important;
		left: 0;
		top: 0;
		right: 0;
		background: #fff;
		z-index: 999;
		width: 100%;
		height: 100%;
		overflow: hidden;
		
		.list {
			padding: 10px;
			h3{
				color: @colorblue;
				font-style: normal;
				font-size: 17px;
				padding-bottom: 4px;
			}
			.text {
				font-size: 16px;
				color: @colorgray;
				margin-bottom: 10px;
			}
		}
	}
</style>